<template>
	<div class="webheart">
		<div class="help_center_wrapper">
			<h2>帮助文件</h2>
			<el-table :data="helpAttachList" style="width: 100%">
				<el-table-column type="index" label="序号" width="54"></el-table-column>
				<el-table-column prop="name" label="文件名称"></el-table-column>
				<el-table-column label="操作" width="76">
					<template slot-scope="{ row }">
						<el-button type="primary" size="small" @click="handleDownloadHelpFile(row)">下载</el-button>
					</template>
				</el-table-column>
			</el-table>
		</div>
	</div>
</template>

<script>
import { openApiNoticePageList } from '@/api/openApi';
export default {
	data() {
		return {
			helpPageList: []
		};
	},
	computed: {
		helpAttachList() {
			let fileArr = [];
			let attachArr = this.helpPageList.map((item) => item.sysNoticeFilesList);
			attachArr.forEach((item) => {
				fileArr = [...fileArr, ...item];
			});
			return fileArr;
		}
	},
	mounted() {
		this.getHelpPageList();
	},
	methods: {
		//获取帮助中心列表
		async getHelpPageList() {
			let params = { page: 1, limit: 999, type: 5 };
			let result = await openApiNoticePageList(params).then((res) => res.data);
			if (result.code === '0') {
				this.helpPageList = result.data || [];
			}
		},

		//下载帮助中心文件
		handleDownloadHelpFile(data) {
			let attachData = data.sysAttachment;
			fetch(attachData.httpUrl, { method: 'GET', cache: 'no-cache' }).then(async (res) => {
				let blobData = await res.blob();
				let elink = document.createElement('a');
				elink.download = attachData.oldName;
				elink.style.display = 'none';
				elink.href = URL.createObjectURL(blobData);
				document.body.appendChild(elink);
				elink.click();
				document.body.removeChild(elink);
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.help_center_wrapper {
	padding: 40px 0;
	h2 {
		font-size: 24px;
		font-weight: 600;
		color: #303133;
		margin-bottom: 20px;
	}
	.el-table {
		border: solid 1px #ebeef5;
		border-bottom: none;
	}
}
</style>
